const path = require('path')
const resolve = dir => path.resolve(__dirname, dir)
const { defineConfig } = require('@vue/cli-service')
const CompressionWebpackPlugin = require('compression-webpack-plugin');
const webpack = require("webpack");
module.exports = defineConfig({
  publicPath: '/', // 默认'/'，部署应用包时的基本 URL
  // baseUrl: './', // 默认'/'，部署应用包时的基本 URL
  outputDir: 'dist', // 'dist', 生产环境构建文件的目录
  assetsDir: '', // 相对于outputDir的静态资源(js、css、img、fonts)目录
  lintOnSave: false,
  runtimeCompiler: false, // 是否使用包含运行时编译器的 Vue 构建版本
  productionSourceMap: false, // 生产环境的 source map
  configureWebpack: {
    devtool: 'source-map',// 保证源码正确加载
    performance: {
      hints: 'warning',
      //入口起点的最大体积
      maxEntrypointSize: 50000000,
      //生成文件的最大体积
      maxAssetSize: 30000000,
      //只给出 js 文件的性能提示
      assetFilter: function (assetFilename) {
        return assetFilename.endsWith('.js');
      }
    }
  },
  transpileDependencies: true,
  devServer: {
    // host: 'localhost', // 设置ip或者localhost访问
    // host: 'localhost', // 本地访问
    port: 8888,
    hot: true,
    historyApiFallback: true,
    allowedHosts: "all",
    client: {
      reconnect: false
    },
    proxy: {
      '/api': {
        target: process.env.VUE_APP_BASE_API || 'http://localhost:8081',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
          // pathRewrite: {'^/api': '/'} 
          // pathRewrite: {'^/api': '/api'} 重写之后url为 http://192.168.1.16:8085/api/xxxx
        }
      }
    }
  },
  chainWebpack: (config) => {
    config.plugins.delete('prefetch');
    if (process.env.NODE_ENV !== 'development') {
      // 对超过10kb的文件gzip压缩
      config.plugin('compressionPlugin').use(
        new CompressionWebpackPlugin({
          test: /\.(js|css|html)$/,// 匹配文件名
          threshold: 10240,
        })
      );
    }
    config.plugin('html').tap(args => {
      args[0].title = '数据可视化' // 浏览器title
      return args
    })
    config.resolve.alias
      .set('@', resolve('src'))
      .set('assets', resolve('src/assets'))
      .set('components', resolve('src/components'))
      .set('common', resolve('src/common'))
      .set('store', resolve('src/store'))
      .set('api', resolve('src/api'))
      .set('router', resolve('src/router'))
      .set('utils', resolve('src/utils'))
  },
})
